<script >
//同意张三申请返校后决定暂缓延期还是直接返校
export default {
  methods:{
    toNext ()  {
      uni.navigateTo({
        url: "/teacher/demo/tyfxshq"
      })
    },
    toAgree () {
      uni.navigateTo({
        url: "/teacher/demo/yqfx"  // 跳转到延期返校的目标页面
      })
    },
    tozh () {
      uni.navigateTo({
        url: "/teacher/demo/zhfx"  // 跳转到延期返校的目标页面
      })
    }
  }
}
</script>

<template>
  <view class="main">

    <view class="bj">
      <text class="tip">
        <image class="img" src="/static/image/tip.png"></image>
        可关注“成电智慧学工”服务号获取审批通知
      </text>
    </view>
    <view class="input">
      <view class="item-header">
        <text claass="item-name">张三</text>
        <text claass="item-id">123456789</text>
      </view>
      <!--    申请时间-->
      <view class="item-apply-time">申请时间：2025-10-10-10:00:00</view>
      <!--    专业-->
      <view class="item-major">软件工程</view>
      <view class="item-footer">
        <view class="item-avatar">头像</view>
        <text class="item-status">同意返校</text>
      </view>
    </view>
    <view class="input2">
      <!--    第二个框-->
      <view class="time">
        <b>预计返校时间：</b><br>
        2025-10-11-11：00
      </view>
      <view >
        <b>申请理由：</b><br>
        回校学习
      </view>
      <view class="book">
        <b>健康码和行程码：</b><br>
          <image class="tp" src="/static/image/erwm.png"></image>
          <image class="tp" src="/static/image/erwm.png"></image>
      </view>
    </view>
    <view class="button-group">
      <button :disabled="disabled" type="primary" @click="toNext()">同意申请 </button>


    <button :disabled="disabled" type="primary"  @click="toAgree()" >延期返校</button>

      <button :disabled="disabled" type="primary"  @click="tozh()" >暂缓返校</button>
    </view>
  </view>

</template>

<style >
.main{
  height: 4000px;
  width: 100%;
  background-color: rgba(239,239,244,1);

}
.bj{
  width: 100%;
  height: 28px;
  background: #DEE9FF;
  padding: 8px;
}

/*文本样式*/
.tip{
  font-weight: 400;
  font-size: 12px;

  letter-spacing: 0;/*字体间距*/
  display: flex;
  align-items: center;
}
/*图片样式*/
.img{
  width: 16px;
  height: 16px;
  top:3px;
}
.input{
  height: 170px;
  background-color: white;
  padding: 15px;
  margin: 10px;

}
.item-header {
  display: flex;
  justify-content: space-between;
  margin: 8px;
}
.item-name{
  font-weight: bold;
  font-size: 16px;
}
.item-id {
  color: #999;
  font-size: 14px;
}
.item-apply-time{
  color: orange;
  font-size: 14px;
  margin: 8px;
}
.item-major{
  margin: 8px;
  color: #999;
  font-size: 14px;
}
.item-footer {
  display: flex;
  align-items: center;
}
.item-avatar {
  width: 40px;
  height: 40px;
  border: 1px solid #ccc;
  border-radius: 50%; /* 圆形头像 */
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 10px;
  font-size: 12px;
}
.item-status {
  color: green;
  margin-right: 10px;
}
.item-action {
  color: #999;
  font-size: 14px;
  display:flex;
  align-items: center;
}
.input2{
  height: 230px;
  padding: 15px;
  background-color: rgba(255, 255, 255, 1);
  font-weight: 400;
  font-style: normal;
  font-size: large;

  margin: 10px 10px;
}
.tp{
  height: 50px;
  width: 50px;

}
.button-group{
  display: flex;
  justify-content: center;
  margin: 10px 10px;

}
</style>